<template>
	<div id='app'>
		<el-card shadow="never" class="box-card" style="width: 696; height: 140;">
			<el-form :inline="true" :model="formInline" class="demo-form-inline">
				<el-form-item label="任务编号">
					<el-input v-model="formInline.task_transport_id" placeholder="请输入任务编号"></el-input>
				</el-form-item>
				<el-form-item label="司机名称">
					<el-input v-model="formInline.driverId" placeholder="请输入司机名称"></el-input>
				</el-form-item>
				<el-form-item label="任务状态">
					<el-select v-model="formInline.status" placeholder="请选择">
						<el-option label="待发车" value="1"></el-option>
						<el-option label="在途" value="2"></el-option>
						<el-option label="待确认" value="3"></el-option>
						<el-option label="已到达" value="4"></el-option>
						<el-option label="已取消" value="5"></el-option>
					</el-select>
				</el-form-item>
				<el-form-item>
					<el-button style="margin-right:73%;" type="primary" @click="onSubmit">搜索</el-button>
				</el-form-item>
				<el-form-item>
					<el-button style="margin-right:60%;" @click="clearform">重置</el-button>
				</el-form-item>
			</el-form>

		</el-card>
		<br>
		<br>
		<el-card class="box-card">
			<el-table :data="tableData" border style="width: 100%">
				<el-table-column prop="id" label="编号" width="120">
				</el-table-column>
				<el-table-column prop="taskTransportId" label="运输任务编号" width="200">
				</el-table-column>
				<el-table-column prop="taskTransport.truck.licensePlate" label="车牌号码" width="180">
				</el-table-column>
				<el-table-column prop="startAgency.name" label="调度机构" width="180">
				</el-table-column>
				<el-table-column prop="startAgency.name" label="起始地" width="180">
				</el-table-column>
				<el-table-column prop="endAgency.name" label="目的地" width="180">
				</el-table-column>
				<el-table-column prop="driver.user.name" label="司机" width="180">
				</el-table-column>
				<el-table-column prop="status" label="运输任务状态" width="180">
				</el-table-column>
				<el-table-column prop="taskTransport.loadingStatus" label="车辆装载状态" width="180">
				</el-table-column>
				<el-table-column prop="taskTransport.planPickUpGoodsTime" label="计划提货时间" width="200">
				</el-table-column>
				<el-table-column prop="taskTransport.actualPickUpGoodsTime" label="实际提货时间" width="200">
				</el-table-column>
				<el-table-column prop="planDepartureTime" label="计划发车时间" width="200">
				</el-table-column>
				<el-table-column prop="actualDepartureTime" label="实际发车时间" width="200">
				</el-table-column>
				<el-table-column fixed="right" label="操作" width="200">
					<template slot-scope="scope">
						<a href="javascript:;" @click="showdetail(scope.row)">查看运输任务详情</a>
					</template>
				</el-table-column>
				</el-table-column>
			</el-table>
			<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
				:current-page="currentPage4" :page-sizes="[4, 5, 7, 10]" :page-size="formInline.pageSize"
				layout="total, sizes, prev, pager, next, jumper" :total="total">
			</el-pagination>
		</el-card>

	</div>
</template>

<script>
	import {
		queryall
	} from "@/api/Driverjob.js"
	export default {
		data() {
			return {
				total: 0,
				formInlineInit: {
					id: '',
					driverId: '',
				 status: '',
					pageSize: '4',
					pageIndex: '1'
				},
				formInline: {
					task_transport_id: '',
					driverId: '',
					status: '',
					pageSize: '4',
					pageIndex: '1'
				},
				tableData: [{
					date: '2016-05-02',
					name: '王小虎',
					address: '上海市普陀区金沙江路 1518 弄'
				}, {
					date: '2016-05-04',
					name: '王小虎',
					address: '上海市普陀区金沙江路 1517 弄'
				}, {
					date: '2016-05-01',
					name: '王小虎',
					address: '上海市普陀区金沙江路 1519 弄'
				}, {
					date: '2016-05-03',
					name: '王小虎',
					address: '上海市普陀区金沙江路 1516 弄'
				}]
			}
		},
		methods: {
			inittable() {
				queryall(this.formInline).then((data) => {
					// data.data.list.foreach((index,item)=>{
					// 	item.index=index;
					// })
					this.total = data.data.total;
					console.log(data.data.list)
					console.log(data.data.list[0].driver.user)
					this.tableData = data.data.list;
				})
			},
			onSubmit() {
				console.log(this.formInline);
				this.inittable();
				console.log('submit!');
			},
			clearform() {
		 	this.formInline = this.formInlineInit;
			},
			showdetail(row) {
				this.$router.push({
					name: 'detail',
					params: {
						driverjob: row
					}
				})
			}
			},
			created() {
				this.inittable();
			}
		}
</script>

<style>
</style>
